// uno.config.ts
import { defineConfig, presetUno, presetIcons } from 'unocss';
import { presetRemToPx } from '@unocss/preset-rem-to-px';

export default defineConfig({
	// ...UnoCSS options
	presets: [
		presetUno(),
		presetRemToPx({
			baseFontSize: 4,
		}),
		presetIcons({
			extraProperties: {
				'display': 'inline-block',
				'vertical-align': 'middle',
				// ...
			},
		})
	],
	rules: [
		// ['bed-size', { width: '120px', height: '120px' }],
		['overflow-auto', { overflow: 'auto' }],
		['min-width-100', { 'min-width': '100%' }],
		['box-s', { 'box-shadow': '0px 0px 5px rgba(0, 0, 0, 0.2)' }],
		[/^br-(\d+)$/, ([_, d]) => ({ 'border-radius': `${d}px` })],
		[/^bd-(#*\w+)$/, ([_, color]) => ({ border: `1px solid ${color}` })],
		[/^b-(\w+)-(#*\w+)$/, ([_, position, color]) => ({ [`border-${position}`]: `1px solid ${color}` })],
	],
	shortcuts: {
		'form-wrap': 'bg-white p20',
		'thirtyPercentWidth': 'w-[33%] pr40',
		'fourtyPercentWidth': 'w-[25%] pr20',
		'fullWidth': 'w-[100%] min-width-100',
		'halfWidth': 'w-[50%]',
		'bed-height': 'h-160',
		'bed-size': 'w-180 bed-height',
		'bed-item': 'bed-size bd-#eee mb-10 bg-white overflow-hidden font-size-12 br-8 box-s',
	}
});
